<template>
	<view class="annex-list">
		<view class='' v-if="annexEntities.length > 0">
			<view class='file-content'>
				<view class='file-item' v-for="(annex, index) in annexEntities" :key="index" @click="querySingle(annex)">
					<image v-if='annex.suffix == ".png" || annex.suffix == ".jpg" || annex.suffix == ".jpeg"'
						:src='annex.fileUrl' @click="preview(annex)" class="pic"></image>
					<image v-if='annex.suffix == ".pdf"' src='../static/img/PDF.png'
						class="pic"></image>
					<view class="text">{{annex.title}}</view>
				</view>
			</view>
		</view>
		<o-empty v-else bg="#f3f3f3"></o-empty>
	</view>
</template>

<script>
	import {
		api,
		post
	} from '@/util/api'
	export default {
		props: {
			business: 0, // 关联的业务类型
			relationId: '', // 关联的业务Id
		},
		data() {
			return {
				annexEntities: [],
			}
		},
		created() {
			this.queryList()
		},
		methods: {
			queryList() {
				post(api.AnnexEntities, {
					business: this.business,
					relationId: this.relationId
				}).then(res => {
					this.annexEntities = res.data
					this.annexEntities.forEach(function(item, index){
						let suffix = item.fileUrl.substring(item.fileUrl.lastIndexOf('.'))
						item.suffix = suffix
					})
				})
			},
			// 全屏看图片
			preview(annex) {
				uni.previewImage({
					urls: [annex.fileUrl], // 需要预览的图片链接列表
				});
			},
			querySingle(annex){
				let prefix = annex.fileUrl.substring(annex.fileUrl.lastIndexOf('.'))
				if (prefix == '.pdf') {
					uni.navigateTo({
						url: '/components/ViewerPage?type=1&id=' + annex.id
					})
				}
			}
		}
	}
</script>

<style>
	@import '../static/css/AnnexList.css';
</style>